const {defineConfig} = require('@vue/cli-service')
const CompressionWebpackPlugin = require("compression-webpack-plugin");
const productionGzipExtensions = ["js", "css"];

const cdn = {
    //douyin
    css: ["https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/element-ui/2.15.7/theme-chalk/index.min.css"],
    js: [
        "https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.11/vue.min.js",
        "https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue-router/3.5.2/vue-router.min.js",
        "https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/vuex/3.6.2/vuex.min.js",
        "https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/axios/0.21.1/axios.min.js",
        "https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/element-ui/2.15.7/index.min.js",
        "https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/lodash.js/4.17.21/lodash.min.js"
    ]
};

module.exports = defineConfig({
    transpileDependencies: true,
    lintOnSave: false,
    productionSourceMap: false, // 生产环境下关闭源码地图，即不生产对应的map文件，减小打包结果的体积

    //webpack配置
    configureWebpack: {
        //忽略将这些加入打包
        externals: {
            vue: 'Vue',
            'vue-router': 'VueRouter',
            vuex: 'Vuex',
            'element-ui': 'ELEMENT',
            axios: 'axios',
            lodash: '_'
        },
        plugins: [
            new CompressionWebpackPlugin({
                filename: '[path].gz[query]',
                algorithm: 'gzip',
                test: new RegExp(`\\.(${productionGzipExtensions.join('|')})$`),
                threshold: 10240,
                minRatio: .2
            })
        ]
    },

    chainWebpack: (config) => {
        config.optimization.minimizer('terser').tap((args) => {
            args[0].terserOptions.compress.drop_console = true
            return args
        })
    },
    //这里是咱们的webpack的server相关的配置，这里配端口，跨区请求，方向代理。
    devServer: {
        port: 80,
        proxy: {
            // 只要axios请求中带有/api的url,就会触发代理机制
            '/api': {
                // 目标路径：target(我们要代理请求的地址)
                //target: 'http://localhost:10086/myproject',
                target: 'http://localhost:8080/usermanage',
                // 允许跨域
                changOrigin: true,
                // 重写路径 api代替了目标路径
                pathRewrite: {
                    '^/api': ''
                }
            }
        }
    }
})
